<script setup lang="ts">
import {getShareFileApi,reShareFileType} from '../FileApi.ts'
import {ref,Ref,onMounted} from "vue";
import {CopyDocument,Key} from '@element-plus/icons-vue'

import {digElMessage} from "../../../common/Message.ts";

let data:Ref<reShareFileType>=ref([]);
const getData=async ()=>{
  await getShareFileApi().then(res=>{

     data.value=res.data
   })
}
//复制链接
const copyUrl=(e:string)=>{

  if(window.isSecureContext){
    navigator.clipboard.writeText(e).then(res=>{
      digElMessage("复制成功","success",1000)
    })
  }
  //不安全域使用
  else{
    const textArea = document.createElement('textarea');
    document.body.appendChild(textArea);
    textArea.textContent = e;
    //选择
    textArea.select();
    //复制
    document.execCommand && document.execCommand('copy');
    digElMessage("复制成功","success",1000)
  }

  navigator.clipboard.writeText(e)


}
onMounted(()=>{
  getData()
})


let shpwPasswordType=ref("password")


</script>

<template>
  <el-table :data="data" style="width: 100vw" >
    <el-table-column  label="分享类型" width="80" >
      <template #default="scope">
         <el-text>
           {{scope.row.shareFileType==0?'文件':'文件夹'}}
         </el-text>
      </template>
    </el-table-column>

    <el-table-column label="状态" align="center" width="90">
      <template #default="scope">
        <el-button text  type="success" v-if="scope.row.shareDate==0">永不过期</el-button>
        <el-button text type="warning" v-if="scope.row.shareDate==-1">已经取消</el-button>
        <el-button type="primary" text
                   v-if="scope.row.shareDate!=0&&scope.row.shareDate!=-1&&!scope.row.lose">未过期</el-button>
        <el-button text type="danger" v-else>已经过期</el-button>
    </template>
    </el-table-column>


    <el-table-column prop="shareLoseTime"  label="过期时间"  >


    </el-table-column>

    <el-table-column label="访问链接"  >

      <template #default="scope">
        <el-input
            v-model="scope.row.sharePath"
            style="max-width: 180px"
            disabled
        />

        <el-button text :icon="CopyDocument" @click="copyUrl(scope.row.sharePath)"></el-button>

      </template>
    </el-table-column>


    <el-table-column label="密码" >

      <template #default="scope">

        <el-input
            v-model="scope.row.sharePassword"
            disabled
            :type="shpwPasswordType"
            style="width: 80px"
        />

        <el-button text :icon="Key"  @click="shpwPasswordType=='password'?shpwPasswordType='text':shpwPasswordType='password'"></el-button>

      </template>
    </el-table-column>

    <el-table-column label="操作" width="150">


    </el-table-column>

</el-table>
</template>

<style scoped>

</style>